<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>ACT丶流星雨</title>
		<style>
			body {
				cursor: url(https://cdn.jsdelivr.net/gh/xb2016/kratos-pjax@0.4.4/static/images/cursor.cur), default;
			}

			a:hover {
				cursor: url(https://cdn.jsdelivr.net/gh/xb2016/kratos-pjax@0.4.4/static/images/pointer.cur), pointer;
			}

			.topnav {
				overflow: hidden;
				position: fixed;
				top: 0px;
				width: 100%;
				z-index: 20;
				box-shadow: 0px -20px 100px #000000;
			}

			.topnav a {
				float: left;
				display: block;
				color: white;
				text-align: center;
				padding: 14px 16px;
				text-decoration: none;
				font-size: 17px;
			}

			.topnav a:hover {
				background-color: rgba(255, 170, 127, 0.5);
				color: #aa5500;
			}

			.topnav a.active {
				background-color: rgba(170, 0, 255, 0.5);
				color: white;
			}

			.topnav input[type=text] {
				float: right;
				padding: 6px;
				margin-top: 8px;
				margin-right: 16px;
				border: none;
				font-size: 17px;
			}

			@media screen and (max-width: 600px) {

				.topnav a,
				.topnav input[type=text] {
					float: none;
					display: block;
					text-align: left;
					width: 100%;
					margin: 0;
					padding: 14px;
				}

				.topnav input[type=text] {
					border: 1px solid #ccc;
					background-color: rgba(0, 255, 0, 0.0);
				}
			}

			@import url('https://fonts.googleapis.com/css2?family=Quicksand&display=swap');

			:root {
				font-size: 15px;
			}

			body {
				font-family: 'Quicksand', sans-serif;
				margin: 0;
				min-height: 100vh;
				background-color: #e493d0;
				background-image:
					radial-gradient(closest-side, rgba(235, 105, 78, 1), rgba(235, 105, 78, 0)),
					radial-gradient(closest-side, rgba(243, 11, 164, 1), rgba(243, 11, 164, 0)),
					radial-gradient(closest-side, rgba(254, 234, 131, 1), rgba(254, 234, 131, 0)),
					radial-gradient(closest-side, rgba(170, 142, 245, 1), rgba(170, 142, 245, 0)),
					radial-gradient(closest-side, rgba(248, 192, 147, 1), rgba(248, 192, 147, 0));
				background-size:
					130vmax 130vmax,
					80vmax 80vmax,
					90vmax 90vmax,
					110vmax 110vmax,
					90vmax 90vmax;
				background-position:
					-80vmax -80vmax,
					60vmax -30vmax,
					10vmax 10vmax,
					-30vmax -10vmax,
					50vmax 50vmax;
				background-repeat: no-repeat;
				animation: 10s movement linear infinite;
				display: flex;
				justify-content: center;
				align-items: center;
				min-height: 100vh;
			}

			body::after {
				content: '';
				display: block;
				position: fixed;
				width: 100%;
				height: 100%;
				top: 0;
				left: 0;
				backdrop-filter: blur(10px);
				-webkit-backdrop-filter: blur(10px);
			}

			span {
				z-index: 10;
				display: flex;
				min-height: 100vh;
				width: 100%;
				justify-content: center;
				align-items: center;
				font-size: 5rem;
				color: transparent;
				text-shadow:
					0px 0px 1px rgba(255, 255, 255, 0.7),
					0px 4px 4px rgba(0, 0, 0, .05);
				letter-spacing: .2rem;
				position: relative;
			}

			span::after {
				display: flex;
				min-height: 100vh;
				justify-content: center;
				align-items: center;
				content: attr(data-spotlight);
				color: transparent;
				position: absolute;
				top: 0;
				-webkit-clip-path: ellipse(100px 100px at 0% 50%);
				clip-path: ellipse(100px 100px at 0% 50%);
				animation: spotlight 7s infinite;
				background-image: url(https://images.unsplash.com/photo-1579547621869-0ddb5f237392?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1500&q=80);
				background-size: 150%;
				background-position: center center;
				-webkit-background-clip: text;
				background-clip: text;
			}

			@keyframes spotlight {
				0% {
					-webkit-clip-path: ellipse(100px 100px at 0% 50%);
					clip-path: ellipse(100px 100px at 0% 50%);
				}

				50% {
					-webkit-clip-path: ellipse(100px 100px at 100% 50%);
					clip-path: ellipse(100px 100px at 100% 50%);
				}

				100% {
					-webkit-clip-path: ellipse(100px 100px at 0% 50%);
					clip-path: ellipse(100px 100px at 0% 50%);
				}
			}

			@keyframes movement {

				0%,
				100% {
					background-size:
						130vmax 130vmax,
						80vmax 80vmax,
						90vmax 90vmax,
						110vmax 110vmax,
						90vmax 90vmax;
					background-position:
						-80vmax -80vmax,
						60vmax -30vmax,
						10vmax 10vmax,
						-30vmax -10vmax,
						50vmax 50vmax;
				}

				25% {
					background-size:
						100vmax 100vmax,
						90vmax 90vmax,
						100vmax 100vmax,
						90vmax 90vmax,
						60vmax 60vmax;
					background-position:
						-60vmax -90vmax,
						50vmax -40vmax,
						0vmax -20vmax,
						-40vmax -20vmax,
						40vmax 60vmax;
				}

				50% {
					background-size:
						80vmax 80vmax,
						110vmax 110vmax,
						80vmax 80vmax,
						60vmax 60vmax,
						80vmax 80vmax;
					background-position:
						-50vmax -70vmax,
						40vmax -30vmax,
						10vmax 0vmax,
						20vmax 10vmax,
						30vmax 70vmax;
				}

				75% {
					background-size:
						90vmax 90vmax,
						90vmax 90vmax,
						100vmax 100vmax,
						90vmax 90vmax,
						70vmax 70vmax;
					background-position:
						-50vmax -40vmax,
						50vmax -30vmax,
						20vmax 0vmax,
						-10vmax 10vmax,
						40vmax 60vmax;
				}
			}
		</style>
	</head>
	<body>
		<span data-spotlight="ACT丶流星雨">ACT丶流星雨</span>
		<div class="topnav">
			<a class="active" href="https://act_meteor{$rthSuffix}/">主页</a>
            <!-- <a class="active" href="https://act_meteor{$rthSuffix}/%E5%9C%A3%E8%AF%9E%E8%8A%82.html">圣诞节</a> -->
			<a href="https://music.163.com/#/song?id=1463458838">主页音乐</a>
			<a href="https://act_meteor{$rthSuffix}/csgobox.html">开箱生成3代</a>
			<a href="https://act_meteor{$rthSuffix}/csgobox2.html">开箱生成2代</a>
			<a href="https://act_meteor{$rthSuffix}/csgobox3.html">开箱生成1代</a>
			<a href="https://act_meteor{$rthSuffix}/show.html">屏幕生成</a>
			<a href="https://act_meteor{$rthSuffix}/cj.html">验证码程序</a>
			<a href="https://act_meteor{$rthSuffix}/about.html">关于</a>
			<input type="text" placeholder="搜索..">
		</div>
		<div id="music" style="position: fixed;;z-index: 20;opacity: 0;">
			<iframe frameborder="no" border="0" marginwidth="0" marginheight="0" width=330 height=86
				src="//music.163.com/outchain/player?type=2&id=1463458838&auto=1&height=66"></iframe>
		</div>
	</body>
</html>
